<template>
  <div>
    <!--头部-->
    <header class="publicHeader">
      <h1>超市订单管理系统</h1>
      <div class="publicHeaderR">
        <p><span>下午好！</span><span style="color: #fff21b"> 系统管理员</span> , 欢迎你！</p>
        <a href="jsp/logout.do">退出</a>
      </div>
    </header>
    <!--时间-->
    <section class="publicTime">
      <span id="time">2015年1月1日 11:11  星期一</span>
      <a href="#">温馨提示：为了能正常浏览，请使用高版本浏览器！（IE10+）</a>
    </section>
    <!--主体内容-->
    <section class="publicMian ">
      <div class="left">
        <h2 class="leftH2"><span class="span1"></span>功能列表 <span></span></h2>
        <nav>
          <ul class="list">
            <li><a href="jsp/bill.do?method=query">订单管理</a></li>
            <li><a href="#/providerManager">供应商管理</a></li>
            <li><a href="#/userManager">用户管理</a></li>
            <li><a href="jsp/pwdmodify.jsp">密码修改</a></li>
            <li><a href="jsp/logout.do">退出系统</a></li>
          </ul>
        </nav>
      </div>
      <input type="hidden" id="path" name="path" value="/SMBMS"/>
      <input type="hidden" id="referer" name="referer" value="http://localhost:8080jsp/user.do?method=query"/>
      <div class="right">
        <div class="location">
          <strong>你现在所在的位置是:</strong>
          <span>用户管理页面 >> 用户修改页面</span>
        </div>
        <div class="providerAdd">
            <div>
              <label for="userName">用户名称：</label>
              <input type="text" name="userName" id="userName" value="" v-model="user.userName">
              <font color="red"></font>
            </div>
            <div>
              <label>用户性别：</label>
              <select name="gender" id="gender" v-model="user.gender">


                <option value="2">男</option>
                <option value="1">女</option>


              </select>
            </div>
            <div>
              <label for="data">出生日期：</label>
              <input type="date"id="birthday" name="birthday" v-model="user.birthday">
              <font color="red"></font>
            </div>

            <div>
              <label for="userphone">用户电话：</label>
              <input type="text" name="phone" id="phone" value="" v-model="user.phone">
              <font color="red"></font>
            </div>
            <div>
              <label for="userAddress">用户地址：</label>
              <input type="text" name="address" id="address" value="" v-model="user.address">
            </div>
            <div>
              <label>用户角色：</label>
              <!-- 列出所有的角色分类 -->
              <input type="hidden" value="3" id="rid"/>
              <select name="userRole" id="userRole"></select>
              <font color="red"></font>
            </div>
            <div class="providerAddBtn">
              <input type="button" name="save" id="save" value="保存" @click="updateUser"/>
              <input type="button" id="back" name="back" value="返回"/>
            </div>
        </div>
      </div>
    </section>


    <footer class="footer">
      版权归关老师
    </footer>
  </div>
</template>

<script>
import axios from "axios";

export default {
  name: "UserUpdate",
  data() {
    return {
      uid: 0,
      user: {}
    }
  },
  created() {
    this.uid = this.$route.query.id
    this.loadUserData()
  },
  methods: {
    loadUserData() {
      let _this = this
      axios.get('/api/smbms-user/user/id/' + this.uid)
          .then((response) => {
            _this.user = response.data.data
          })
    },
    updateUser() {
      let _this = this
      let data = new URLSearchParams();
      data.append('userName', this.user.userName)
      data.append('phone', this.user.phone)
      data.append('address', this.user.address)
      data.append('gender', this.user.gender)
      data.append('birthday', this.user.birthday)
      data.append('id', this.user.id)
      axios({
        url: '/api/smbms-user/user',
        method: 'put',
        data: data
      }).then((response) => {
        if (response.data.success) {
          _this.$router.push('userManager')
        } else {
          _this.$message({
            type: 'error',
            message: '修改失败'
          });
        }
      })
    }
  }
}
</script>

<style lang="css">
/*引入外部css文件*/
@import url('../assets/css/style.css');
@import url('../assets/css/public.css');
</style>